<template>
	<view>
		<view style="border-bottom:1rpx solid #f0f0f0;">
			<fui-tabs :tabs="helpClass" :current="currentIndex" isSlider selectedColor="#000" sliderBackground="#FFDD00" @change="changePages"></fui-tabs>
		</view>
		<view>
			<view style="background-color: #FFF;padding:10rpx;" v-for="(item,index) in helpList" :key="index">
				<view style="padding:20rpx;background:#FFF;border-bottom:1rpx solid #f0f0f0" @click="helpDetail(item.HelpID)">
					{{ item.HelpTitle }}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	
	export default {
		data() {
			return {
				helpClass: [],
				helpList: [],
				currentIndex: 0,
				currentClass: -1,
			};
		},
		onLoad() {
			this.getHelpClass();
			this.loadData();
		},
		methods:{
			getHelpClass() {
				this.$httpost('/UserCenter/helpClass', {}).then(res => {
					if (res.code == 200) {
						this.helpClass = res.data.HelpClass;
					}
				});
			},
			loadData() {
				this.$httpost('/UserCenter/helpList', {
					currentClass: this.currentClass
				}).then(res => {
					if (res.code == 200) {
						this.helpList = res.data.HelpList;
					}
				});
			},
			changePages(e, index) {
				this.currentIndex = e.index;
				this.currentClass = e.value;				
			},
			helpDetail(helpID) {
				uni.navigateTo({
					url: '/myPages/pages/helpDetail?helpID=' + helpID
				})
			}
		}
	}
</script>

<style lang="scss">
.fui-item__box {
	width: 100%;
	padding: 26rpx 32rpx;
	box-sizing: border-box;
	display: flex;
	align-items: center;
}

.fui-logo {
	width: 48rpx;
	height: 48rpx;
	margin-right: 24rpx;
	display: block;
}

.fui-descr {
	width: 100%;
	padding: 32rpx;
	font-size: 28rpx;
	line-height: 52rpx;
	color: #7F7F7F;
	word-break: break-all;
	box-sizing: border-box;
}
</style>
